<template>
  <div>
    <a-card v-for="item in cesuoData" :title="item.cesuo.name" style="width: 300px; float: left" :key="item">
      <template #extra
        ><a href="#">{{ item.cesuo.shen }}</a></template
      >
      <a-list size="small" bordered>
        <template>
          <a-list-item v-for="ite in item.kenweiList" :key="ite">
            {{ ite.name }}

            <span v-if="ite.status === 1" style="right: 3px; position: absolute">
              <button type="link" @click="lock(ite)">抢占</button>
            </span>
            <span v-if="ite.status === 0 && name===ite.useName" style="right: 3px; position: absolute">
              <button type="link" @click="unLock12(ite)">结束使用</button>
            </span>
          </a-list-item>
        </template>
      </a-list>
    </a-card>
  </div>
</template>

<script>
  import store from '@/store'
import { getAction } from '../../api/manage'
import { mapState } from 'vuex'

export default {
    computed:{
        ...mapState({realname : state => state.user.realname},)
    },

  data() {
    return {
      cesuoData: [],
      name:'管12'
    }
  },
  methods: {
    async getCesuoList() {
      getAction('/cesuo/cesuo/cesuokenwei').then((res) => {
      this.cesuoData = res.result
    })
    },
    lock(item) {
      getAction('/cindex/lock',item).then((res) => {
        this.getCesuoList()
      })
    },
    unLock12(item) {
        // alert("aaa")
      getAction('/cindex/unlock',item).then((res) => {
        this.getCesuoList()
      })
    },
  },
  mounted() {
    console.log("aaaa"+store.getters.userInfo.realname)
    this.name = store.getters.userInfo.realname

  },
  created() {
    getAction('/cesuo/cesuo/cesuokenwei').then((res) => {
      this.cesuoData = res.result
    })
  },
}
</script>>